import { Meta } from '@storybook/addon-docs';

<Meta title=" How to use components?" />

# How to use components?

We're trying to figure things out. This is a work in progress.

Topics not covered here:

- [How to build a new scene](/docs/how-to-build-a-scene--page)
- [How to build a form](/docs/how-to-build-a-form--page)
- [How does Kea work](https://keajs.org/docs/guide/concepts) and what's our component &lt;-&gt; logic code split.

Topics to cover here:

- Everything after "[how to build a scene](/docs/how-to-build-a-scene--page)" and everything before "[how to build a form](/docs/how-to-build-a-form--page)"
- Overview of most often used components
- Do we use any kind of layout or grid system? If so, what kind and how do I make a row? Do I always need to nest
  elements inside container elements?
- What's our story for typography and paragraphs?
- How much space should be kept between components? What assures this?
- Can I nest components? Can I put a lemon table in a lemon table in a lemon table in a lemon switch's label?
- What about common CSS variables, states (primary, secondary, danger, etc), how do I modify other components or states?
- What CSS conventions do we use? Can I install my own css framework for that one new button?
- Everything with plenty of example code to copy.
